<div ng-controller="CrearPersonaJuridicaController">
<fieldset>
<legend style="text-align: center;">Registrar Persona Juridica</legend>
<h6 style="color: brown;">Los campos marcados con (*) son obligatorios</h6>
<alert ng-repeat="alert in alerts" type="{{alert.type}}" close="closeAlert($index)">
    <span ng-bind-html="alert.msg"></span>
</alert>
<tabset>

<tab heading="Persona Juridica" select="tabPersonaJuridicaSelected()" active="view.tabSelectedPersonaJuridica">
<ng-form name="$parent.formCrearPersonaJuridica">
<fieldset>
    <legend style="background: whitesmoke;">Datos Principales</legend>
    <div class="row">
        <div class="col-sm-4">
            <div class="form-group" ng-class="{ 'has-error' : formCrearPersonaJuridica.tipoDocumento.$invalid && (control.submitted || formCrearPersonaJuridica.tipoDocumento.$dirty)}">
                <label>Tipo Documento</label>
                <label style="color: brown;">(*)</label>
                <select focus-on="focusTipoDocumento" name="tipoDocumento" ng-options="tipodocumento.id as tipodocumento.abreviatura for tipodocumento in combo.tipoDocumentosPJ | orderBy : 'id'" ng-model="view.idTipoDocumentoPJ" class="form-control" required autofocus>
                	<option value="">--Seleccione--</option>
                </select>
                <div ng-show="formCrearPersonaJuridica.tipoDocumento.$invalid && (control.submitted || formCrearPersonaJuridica.tipoDocumento.$dirty)">
                    <p class="help-block" ng-show="formCrearPersonaJuridica.tipoDocumento.$error.required">
                        Ingrese Tipo Documento.
                    </p>
                </div>
            </div>
        </div>
        <div class="col-sm-4">
            <div class="form-group" ng-class="{ 'has-error' : formCrearPersonaJuridica.numeroDocumentoPJ.$invalid && (control.submitted || formCrearPersonaJuridica.numeroDocumentoPJ.$dirty)}">
                <label>N&uacute;mero Documento</label>
                <label style="color: brown;">(*)</label>
                <input name="numeroDocumentoPJ" type="text" ng-model="view.numeroDocumentoPJ" ng-pattern="/^[0-9]+$/" ng-minlength="1" ng-maxlength="20" class="form-control" placeholder="N&uacute;mero Documento" required/>
                <div ng-show="formCrearPersonaJuridica.numeroDocumentoPJ.$invalid && (control.submitted || formCrearPersonaJuridica.numeroDocumentoPJ.$dirty)">
                    <p class="help-block" ng-show="formCrearPersonaJuridica.numeroDocumentoPJ.$error.required">
                        Ingrese Numero de Documento.
                    </p>
                    <p class="help-block" ng-show="formCrearPersonaJuridica.numeroDocumentoPJ.$error.minlength">
                        Minimo 1 Caracter.
                    </p>
                    <p class="help-block" ng-show="formCrearPersonaJuridica.numeroDocumentoPJ.$error.maxlength">
                        Maximo 20 Caracteres.
                    </p>
                    <p class="help-block" ng-show="formCrearPersonaJuridica.numeroDocumentoPJ.$error.pattern">
                        Numero de Documento no Valido.
                    </p>
                    <p class="help-block" ng-show="formCrearPersonaJuridica.numeroDocumentoPJ.$error.sgmaxlength">
                        Debe tener <span ng-bind="getTipoDocumentoPJ().numeroCaracteres"></span> caracteres.
                    </p>
                </div>
            </div>
        </div>
        <div class="col-sm-4">
            <div class="form-group" ng-class="{ 'has-error' : formCrearPersonaJuridica.razonSocial.$invalid && (control.submitted || formCrearPersonaJuridica.razonSocial.$dirty)}">
                <label>Raz&oacute;n Social</label>
                <label style="color: brown;">(*)</label>
                <input name="razonSocial" type="text" ng-model="view.razonSocial" ng-minlength="1" ng-maxlength="150" class="form-control" placeholder="Raz&oacute;n Social" capitalize required/>
                <div ng-show="formCrearPersonaJuridica.razonSocial.$invalid && (control.submitted || formCrearPersonaJuridica.razonSocial.$dirty)">
                    <p class="help-block" ng-show="formCrearPersonaJuridica.razonSocial.$error.required">
                        Ingrese Razon Social.
                    </p>
                    <p class="help-block" ng-show="formCrearPersonaJuridica.razonSocial.$error.minlength">
                        Minimo 1 Caracter.
                    </p>
                    <p class="help-block" ng-show="formCrearPersonaJuridica.razonSocial.$error.maxlength">
                        Maximo 150 Caracteres.
                    </p>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-sm-4">
            <div class="form-group" ng-class="{ 'has-error' : formCrearPersonaJuridica.nombreComercial.$invalid && (control.submitted || formCrearPersonaJuridica.nombreComercial.$dirty)}">
                <label>Nombre Comercial</label>
                <input name="nombreComercial" type="text" ng-model="view.nombreComercial" ng-maxlength="40" class="form-control" placeholder="Nombre Comercial" capitalize/>
                </select>
                <div ng-show="formCrearPersonaJuridica.nombreComercial.$invalid && (control.submitted || formCrearPersonaJuridica.nombreComercial.$dirty)">
                    <p class="help-block" ng-show="formCrearPersonaJuridica.nombreComercial.$error.maxlength">
                        Maximo 40 Caracteres.
                    </p>
                </div>
            </div>
        </div>
        <div class="col-sm-4">
            <div class="form-group" ng-class="{ 'has-error' : formCrearPersonaJuridica.actividadPrincipal.$invalid && (control.submitted || formCrearPersonaJuridica.actividadPrincipal.$dirty)}">
                <label>Actividad Principal</label>
                <label style="color: brown;">(*)</label>
                <input name="actividadPrincipal" type="text" ng-model="view.actividadPrincipal" ng-maxlength="70" class="form-control" placeholder="Actividad Principal" capitalize required/>
                <div ng-show="formCrearPersonaJuridica.actividadPrincipal.$invalid && (control.submitted || formCrearPersonaJuridica.actividadPrincipal.$dirty)">
                    <p class="help-block" ng-show="formCrearPersonaJuridica.actividadPrincipal.$error.required">
                        Ingrese Actividad Principal.
                    </p>
                    <p class="help-block" ng-show="formCrearPersonaJuridica.actividadPrincipal.$error.minlength">
                        Minimo 1 Caracter.
                    </p>
                    <p class="help-block" ng-show="formCrearPersonaJuridica.actividadPrincipal.$error.maxlength">
                        Maximo 70 Caracteres.
                    </p>
                </div>
            </div>
        </div>
        <div class="col-sm-4">
            <div class="form-group" ng-class="{ 'has-error' : formCrearPersonaJuridica.fechaConstitucion.$invalid && (control.submitted || formCrearPersonaJuridica.fechaConstitucion.$dirty)}">
                <label>Fecha Constituci&oacute;n</label>
                <label style="color: brown;">(*)</label>
                <div class="input-group">
                    <input type="text" name="fechaConstitucion" class="form-control" datepicker-popup="dd/MM/yyyy" ng-model="view.fechaConstitucion" is-open="opened" datepicker-options="dateOptions" ng-required="true" close-text="Close" required>
                    <span class="input-group-btn">
                        <button class="btn btn-default" type="button" ng-click="open($event)">
                            <span class="glyphicon glyphicon-calendar"></span>
                        </button>
                    </span>
                </div>
                <div ng-show="formCrearPersonaJuridica.fechaConstitucion.$invalid && (control.submitted || formCrearPersonaJuridica.fechaConstitucion.$dirty)">
                    <p class="help-block" ng-show="formCrearPersonaJuridica.fechaConstitucion.$error.required">
                        Ingrese Fecha.
                    </p>
                    <p class="help-block" ng-show="formCrearPersonaJuridica.fechaConstitucion.$invalid">
                        Fecha no Valida.
                    </p>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-sm-4">
            <div class="form-group" ng-class="{ 'has-error' : formCrearPersonaJuridica.tipoEmpresa.$invalid && (control.submitted || formCrearPersonaJuridica.tipoEmpresa.$dirty)}">
                <label>Tipo Empresa</label>
                <label style="color: brown;">(*)</label>
                <select name="tipoEmpresa" ng-options="tipoEmpresa as tipoEmpresa for tipoEmpresa in combo.tiposEmpresa" ng-model="view.tipoEmpresa" class="form-control" required>
                	<option value="">--Seleccione--</option>
                </select>
                <div ng-show="formCrearPersonaJuridica.tipoEmpresa.$invalid && (control.submitted || formCrearPersonaJuridica.tipoEmpresa.$dirty)">
                    <p class="help-block" ng-show="formCrearPersonaJuridica.tipoEmpresa.$error.required">
                        Ingrese Tipo Empresa.
                    </p>
                </div>
            </div>
        </div>
        <div class="col-sm-4">
            <div class="form-group">
                <label>Fin de Lucro</label>
                <div class="checkbox">
                    <label>
                        <input type="checkbox" ng-model="view.finLucro">
                    </label>
                </div>
            </div>
        </div>
    </div>
</fieldset>
<fieldset>
    <legend style="background: whitesmoke;">Datos Adicionales</legend>
    <div class="row" ng-controller="UbigeoController">
        <div class="col-sm-4">
            <div class="form-group" ng-class="{ 'has-error' : formCrearPersonaJuridica.departamento.$invalid && control.submitted}">
                <label>Departamento</label>
                <select name="departamento" ng-options="departamento.codigo as departamento.denominacion for departamento in combos.departamentos" ng-model="ubigeo.codigoDepartamento" ng-change="changeDepartamento()" class="form-control">
                	<option value="">--Seleccione--</option>
                </select>
                <div ng-show="formCrearPersonaJuridica.departamento.$invalid && control.submitted">
                    <p class="help-block" ng-show="formCrearPersonaJuridica.departamento.$error.required">
                        Ingrese Departamento.
                    </p>
                </div>
            </div>
        </div>
        <div class="col-sm-4">
            <div class="form-group" ng-class="{ 'has-error' : formCrearPersonaJuridica.provincia.$invalid && control.submitted}">
                <label>Provincia</label>
                <select name="provincia" ng-options="provincia.codigo as provincia.denominacion for provincia in combos.provincias" ng-model="ubigeo.codigoProvincia" ng-change="changeProvincia()" class="form-control">
                	<option value="">--Seleccione--</option>
                </select>
                <div ng-show="formCrearPersonaJuridica.provincia.$invalid && control.submitted">
                    <p class="help-block" ng-show="formCrearPersonaJuridica.provincia.$error.required">
                        Ingrese Provincia.
                    </p>
                </div>
            </div>
        </div>
        <div class="col-sm-4">
            <div class="form-group" ng-class="{ 'has-error' : formCrearPersonaJuridica.distrito.$invalid && control.submitted}">
                <label>Distrito</label>
                <select name="distrito" ng-options="distrito.codigo as distrito.denominacion for distrito in combos.distritos" ng-model="ubigeo.codigoDistrito" ng-change="changeDistrito()" class="form-control">
                	<option value="">--Seleccione--</option>
                </select>
                <div ng-show="formCrearPersonaJuridica.distrito.$invalid && control.submitted">
                    <p class="help-block" ng-show="formCrearPersonaJuridica.distrito.$error.required">
                        Ingrese Distrito.
                    </p>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-sm-8">
            <div class="form-group" ng-class="{ 'has-error' : formCrearPersonaJuridica.direccion.$invalid && (control.submitted || formCrearPersonaJuridica.direccion.$dirty)}">
                <label>Direcci&oacute;n</label>
                <input name="direccion" type="text" ng-model="view.direccion" ng-maxlength="70" class="form-control" placeholder="Direccion" capitalize/>
                <div ng-show="formCrearPersonaJuridica.direccion.$invalid && (control.submitted || formCrearPersonaJuridica.direccion.$dirty)">
                    <p class="help-block" ng-show="formCrearPersonaJuridica.direccion.$error.maxlength">
                        Maximo 70 Caracteres.
                    </p>
                </div>
            </div>
        </div>
        <div class="col-sm-4">
            <div class="form-group" ng-class="{ 'has-error' : formCrearPersonaJuridica.referencia.$invalid && (control.submitted || formCrearPersonaJuridica.referencia.$dirty)}">
                <label>Referencia</label>
                <input name="referencia" type="text" ng-model="view.referencia" ng-maxlength="70" class="form-control" placeholder="Referencia" capitalize/>
                <div ng-show="formCrearPersonaJuridica.referencia.$invalid && (control.submitted || formCrearPersonaJuridica.referencia.$dirty)">
                    <p class="help-block" ng-show="formCrearPersonaJuridica.referencia.$error.maxlength">
                        Maximo 70 Caracteres.
                    </p>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-sm-4">
            <div class="form-group" ng-class="{ 'has-error' : formCrearPersonaJuridica.telefono.$invalid && (control.submitted || formCrearPersonaJuridica.telefono.$dirty)}">
                <label>Telefono</label>
                <input name="telefono" type="text" ng-model="view.telefono" ng-maxlength="20" class="form-control" placeholder="Telefono" />
                <div ng-show="formCrearPersonaJuridica.telefono.$invalid && (control.submitted || formCrearPersonaJuridica.telefono.$dirty)">
                    <p class="help-block" ng-show="formCrearPersonaJuridica.telefono.$error.maxlength">
                        Maximo 20 Caracteres.
                    </p>
                </div>
            </div>
        </div>
        <div class="col-sm-4">
            <div class="form-group" ng-class="{ 'has-error' : formCrearPersonaJuridica.celular.$invalid && (control.submitted || formCrearPersonaJuridica.celular.$dirty)}">
                <label>Celular</label>
                <input name="celular" type="text" ng-model="view.celular" ng-maxlength="20" class="form-control" placeholder="Celular" />
                <div ng-show="formCrearPersonaJuridica.celular.$invalid && (control.submitted || formCrearPersonaJuridica.celular.$dirty)">
                    <p class="help-block" ng-show="formCrearPersonaJuridica.celular.$error.maxlength">
                        Maximo 20 Caracteres.
                    </p>
                </div>
            </div>
        </div>
        <div class="col-sm-4">
            <div class="form-group" ng-class="{ 'has-error' : formCrearPersonaJuridica.email.$invalid && (control.submitted || formCrearPersonaJuridica.email.$dirty)}">
                <label>Email</label>
                <input name="email" type="email" ng-model="view.email" ng-maxlength="30" class="form-control" placeholder="correo@dominio.com"/>
                <div ng-show="formCrearPersonaJuridica.email.$invalid && (control.submitted || formCrearPersonaJuridica.email.$dirty)">
                    <p class="help-block" ng-show="formCrearPersonaJuridica.email.$invalid">
                        Email Incorrecto.
                    </p>
                    <p class="help-block" ng-show="formCrearPersonaJuridica.email.$error.maxlength">
                        Maximo 30 Caracteres.
                    </p>
                </div>
            </div>
        </div>
    </div>
</fieldset>
<fieldset>
    <legend style="background: whitesmoke;">Representante legal</legend>
    <div class="row">
        <div class="col-sm-4">
            <div class="form-group" ng-class="{ 'has-error' : formCrearPersonaJuridica.tipoDocumentoRepresentante.$invalid && (control.submitted || formCrearPersonaJuridica.tipoDocumentoRepresentante.$dirty)}">
                <label>Tipo Documento</label>
                <label style="color: brown;">(*)</label>
                <select name="tipoDocumentoRepresentante" ng-options="tipodocumento.id as tipodocumento.abreviatura for tipodocumento in combo.tipoDocumentosPN | orderBy : 'id'" ng-model="view.idTipoDocumentoPN" class="form-control" required>
                	<option value="">--Seleccione--</option>
                </select>
                <div ng-show="formCrearPersonaJuridica.tipoDocumentoRepresentante.$invalid && (control.submitted || formCrearPersonaJuridica.tipoDocumentoRepresentante.$dirty)">
                    <p class="help-block" ng-show="formCrearPersonaJuridica.tipoDocumentoRepresentante.$error.required">
                        Seleccione Tipo Documento.
                    </p>
                </div>
            </div>
        </div>
        <div class="col-sm-4">
            <div class="form-group" ng-class="{ 'has-error' : formCrearPersonaJuridica.numeroDocumentoRepresentante.$invalid && (control.submitted || formCrearPersonaJuridica.numeroDocumentoRepresentante.$dirty)}">
                <label>N&uacute;mero Documento</label>
                <label style="color: brown;">(*)</label>
                <div class="input-group">
                    <input focus-on="focusNumeroDocumentoRepresentante" name="numeroDocumentoRepresentante" type="text" ui-keypress="{13:'buscarRepresentanteLegal($event)'}" ng-model="view.numeroDocumentoPN" ng-pattern="/^[0-9]+$/" ng-minlength="1" ng-maxlength="20" class="form-control" placeholder="N&uacute;mero Documento" required/>
                      <span class="input-group-btn">
                       <button type="button" class="btn btn-default" ng-click="buscarRepresentanteLegal()" >
                           <span class="glyphicon glyphicon-search"></span>
                       </button>
                     </span>
                </div>
                <div ng-show="formCrearPersonaJuridica.numeroDocumentoRepresentante.$invalid && (control.submitted || formCrearPersonaJuridica.numeroDocumentoRepresentante.$dirty)">
                    <p class="help-block" ng-show="formCrearPersonaJuridica.numeroDocumentoRepresentante.$error.required">
                        Ingrese Numero de Documento.
                    </p>
                    <p class="help-block" ng-show="formCrearPersonaJuridica.numeroDocumentoRepresentante.$error.minlength">
                        Minimo 1 Caracter.
                    </p>
                    <p class="help-block" ng-show="formCrearPersonaJuridica.numeroDocumentoRepresentante.$error.maxlength">
                        Maximo 20 Caracteres.
                    </p>
                    <p class="help-block" ng-show="formCrearPersonaJuridica.numeroDocumentoRepresentante.$error.pattern">
                        Numero de Documento no Valido.
                    </p>
                    <p class="help-block" ng-show="formCrearPersonaJuridica.numeroDocumentoRepresentante.$error.sgmaxlength">
                        Debe tener <span ng-bind="getTipoDocumentoPN().numeroCaracteres"></span> caracteres.
                    </p>
                </div>
            </div>
        </div>
        <div class="col-sm-4">
            <div class="form-group">
                <label>&nbsp;</label>
                <div>
                    <button type="button" class="btn btn-link" ng-click="nuevaPersonaRepresentanteLegal()">Registrar Persona</button>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-xs-12">
            <div class="panel panel-default">
                <div class="panel-heading">Representante Legal</div>
                <div class="panel-body" ng-show="!objetosCargados.representanteLegal.apellidoPaterno">
                    <p>Representante Legal no Encontrado</p>
                </div>
                <!-- Table -->
                <table class="table" ng-show="objetosCargados.representanteLegal.apellidoPaterno">
                    <tbody>
                    <tr>
                        <td colspan="1" style="font-weight: bold;">Documento:</td>
                        <td colspan="3"><span ng-bind-template="{{objetosCargados.representanteLegal.tipoDocumento.abreviatura}}/{{objetosCargados.representanteLegal.numeroDocumento}}"></span></td>
                    </tr>
                    <tr>
                        <td colspan="1" style="font-weight: bold;">Apellidos y Nombres:</td>
                        <td colspan="3"><span ng-bind-template="{{objetosCargados.representanteLegal.apellidoPaterno}} {{objetosCargados.representanteLegal.apellidoMaterno}}, {{objetosCargados.representanteLegal.nombres}}"></span></td>
                    </tr>
                    <tr>
                        <td colspan="1" style="width: 170px; font-weight: bold;">Fecha de Nacimiento:</td>
                        <td colspan="1"><span ng-bind="objetosCargados.representanteLegal.fechaNacimiento | date : 'dd/MM/yyyy'"></span></td>
                        <td colspan="1" style="font-weight: bold;">Sexo:</td>
                        <td colspan="1"><span ng-bind="objetosCargados.representanteLegal.sexo"></span></td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</fieldset>
<button type="button" class="btn btn-primary" ng-click="crearTransaccion()" ng-disabled="buttonDisableState()">Guardar</button>
<button type="button" class="btn btn-default" ng-click="cancelar()">Cancelar</button>
</ng-form>
</tab>

<tab heading="Accionistas" select="tabAccionistaSelected()" active="view.tabSelectedAccionista">
    <div ng-include="'views/cajero/persona/juridica/accionista.html'"></div>
</tab>
</tabset>
</fieldset>

</div>